{extend name="common:base" /}
{block name="page_current"}
<div class="fui-page-group statusbar">
    <style>
        .fui-cell-group .fui-cell .fui-cell-label{
            width:4.2rem;
        }
    </style>
    <div class="fui-page  fui-page-current">
        <div class="fui-header">
            <div class="fui-header-left">
                <a class="back" onclick="history.back()"></a>
            </div>
            <div class="title">更换绑定手机号</div>
            <div class="fui-header-right">&nbsp;</div>
        </div>
        <div class="fui-content" style="margin-top:5px;">
            <div class="fui-cell-group">
                <div class="fui-cell must">
                    <div class="fui-cell-label">手机号</div>
                    <div class="fui-cell-info">
                        <input type="tel" class="fui-input" id="mobile" name="mobile" placeholder="请输入您的手机号" value="{$memberModel['mobile']}" maxlength="11">
                    </div>
                </div>
                <div class="fui-cell must" style="padding:0 0.65rem;">
                    <div class="fui-cell-label">图形验证码</div>
                    <div class="fui-cell-info">
                        <input type="tel" class="fui-input" value="" placeholder="请输入图形验证码" name="verifycode2" id="verifycode2" maxlength="4">
                    </div>
                    <div class="remark noremark">
                        <img src="{:url('Publics/img_vcode')}" style="width:6rem;height:2rem; vertical-align:middle;" id="btnCode2">
                    </div>
                </div>
                <div class="fui-cell must">
                    <div class="fui-cell-label">短信验证码</div>
                    <div class="fui-cell-info"><input type="tel" class="fui-input" id="verifycode" name="verifycode" placeholder="6位验证码" value="" maxlength="6"></div>
                    <div class="fui-cell-remark noremark"><a class="btn btn-default btn-default-o btn-sm" id="btnCode">获取验证码</a></div>
                </div>
                <!--
                <div class="fui-cell must">
                    <div class="fui-cell-label">登录密码</div>
                    <div class="fui-cell-info"><input type="password" class="fui-input" id="pwd" name="pwd" placeholder="请输入您的登录密码" value=""></div>
                </div>
                <div class="fui-cell must">
                    <div class="fui-cell-label">确认密码</div>
                    <div class="fui-cell-info"><input type="password" class="fui-input" id="pwd1" name="pwd1" placeholder="请输入确认登录密码" value=""></div>
                </div>
                -->
            </div>
            <a href="javascript:;" id="btnSubmit" class="btn btn-danger block mtop">立即绑定</a>
        </div>
    </div>
    <script>
        function checkPhone(_phone){
            if(!(/^1[1-9]\d{9}$/.test(_phone))){
                // alert("手机号码有误，请重填");
                return false;
            }
            else {
                return true;
            }
        }
        $(function () {
            $('#btnCode2').on('click',function () {
                $('#verifycode2').val('');
                $(this).prop('src',"{:url('Publics/img_vcode')}?t=" + (new Date().getTime()));
            });
            $('#btnCode').on('click',function () {
                var phone = $('#mobile').val();
                var imgcode = $('#verifycode2').val();
                if(!imgcode){
                    FoxUI.toast.show("请填写图形验证码");
                    return false;
                }
                if(!checkPhone(phone)){
                    FoxUI.toast.show("手机号码有误，请重填");
                    return false;
                }
                getVcode(phone,imgcode);
            })

            $('#btnSubmit').click(function() {
                if ($('#btnSubmit').attr('stop')) {
                    return
                }
                if (!$('#mobile').isMobile()) {
                    FoxUI.toast.show('请输入11位手机号码');
                    return
                }
                if (!$('#verifycode').isInt() || $('#verifycode').len() != 6) {
                    FoxUI.toast.show('请填写短信验证码');
                    return
                }
                /*
                if ($('#pwd').isEmpty()) {
                    FoxUI.toast.show('请输入登录密码');
                    return
                }
                if ($('#pwd1').isEmpty()) {
                    FoxUI.toast.show('请重复输入密码');
                    return
                }
                if ($('#pwd').val() !== $('#pwd1').val()) {
                    FoxUI.toast.show('两次密码输入不一致');
                    return
                }
                */
                $('#btnSubmit').html('正在绑定...').attr('stop', 1);
                core.json("{:url('member/bind')}", {
                    mobile: $('#mobile').val(),
                    verifycode: $('#verifycode').val(),
                    pwd: $('#pwd').val()
                }, function(ret) {
                    if (ret.code != 0) {
                        FoxUI.toast.show(ret.msg);
                        $('#btnSubmit').html('立即绑定').removeAttr('stop');
                        return
                    }
                    if (ret.code == 1013) {
                        FoxUI.confirm(ret.msg, "注意", function() {
                            core.json('member/bind', {
                                mobile: $('#mobile').val(),
                                verifycode: $('#verifycode').val(),
                                pwd: $('#pwd').val(),
                                confirm: 1
                            }, function(ret) {
                                if (ret.code == 0) {
                                    FoxUI.alert('绑定成功!', '', function() {
                                        // location.href = params.backurl ? atob(params.backurl) : core.getUrl('member')
                                        history.back();
                                    });
                                    return
                                }
                                FoxUI.toast.show(ret.msg);
                                $('#btnSubmit').html('立即绑定').removeAttr('stop');
                                return
                            }, true, true)
                        }, function() {
                            $('#btnSubmit').html('立即绑定').removeAttr('stop')
                        });
                        return
                    }
                    FoxUI.alert('绑定成功!', '', function() {
                        // location.href = params.backurl ? atob(params.backurl) : core.getUrl('member')

                        history.back();
                    })
                }, true, true)
            })
        })
        function getVcode(_phone,_imgcode) {
            core.json("{:url('Publics/get_vcode')}", {phone:_phone,imgcode:_imgcode}, function (ret) {
                if (ret.code == 1) {

                }
                FoxUI.toast.show(ret.msg)
            }, true, true)
        }
    </script>
</div>
{/block}
